<!--默认渲染模板-->
<template>
    <div >
         {{=content}}
    </div>
</template>


<!--当前页面脚本配置-->
<script>

    exports = {
        templateType:'art',
        data: function () {
            return {
                pageData:{getControlRenderDataById:function(){}},
                content:''
            }
        },
        mounted:function (){
            try{
                var designData = com.oui.AppController.designData;
            }catch(err){
            }
            if(!designData){ //没有设计态数据
                //根据url参数加载 获取
                //默认测试 数据 demo
                designData = {"id":"","name":"页面名称","version":"1.0","canCloneControl":true,"description":"","pageDesignType":"normalForm","listContent":"","content":"\n\n\n    <div class=\"page-abs page-abs-normalForm paper-area A4 bg-center\"\n         style=\"width:210mm;height:297mm;background-color:#ffffff;{{if pageData.getDesigner()&&pageData.getDesigner().backgroundImage}}background-image:url({{=pageData.getDesigner().backgroundImage}}){{/if}};\"\n    >\n          <div id=\"ctrl_103533208508500492\" class=\"control-abs control-abs-component control-abs-html-tableLine control-abs-tableLine control-abs-oneLine \"\n             style=\"left:0px;top:0px;z-index:1;opacity:1;line-height:1;width:99.7834%;height:70.6563px;border-radius:0px;border-left-width:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid\" >\n            <div class=\"control-inner-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle\">\n                \n        <table class=\"control-abs-table-view\">\n        <thead>\n            <tr>\n                \n                \n                <th title=\"列1\" control-abs-id=\"ctrl_103533208508500492\" class=\"control-table-column\"\n                     style=\"width:355.6666666666667px;border-left-style:solid;border-right-style:solid;border-left-color:#e6e6e6;border-left-width:1px;border-right-width:0px;border-right-color:#e6e6e6;\"\n                     line-column-index=\"0\" line-column-length=\"3\"\n                     line-row-length=\"2\"\n                        >\n                    A\n                </th>\n                \n                \n                \n                <th title=\"列2\" control-abs-id=\"ctrl_103533208508500492\" class=\"control-table-column\"\n                     style=\"width:438.0216666666667px;border-left-style:solid;border-right-style:solid;border-left-color:#e6e6e6;border-left-width:1px;border-right-width:1px;border-right-color:#e6e6e6;\"\n                     line-column-index=\"1\" line-column-length=\"3\"\n                     line-row-length=\"2\"\n                        >\n                    B\n                </th>\n                \n                \n                \n                \n            </tr>\n        </thead>\n        <tbody>\n            \n            \n            <tr title=\"行1\" control-abs-id=\"ctrl_103533208508500492\" class=\"control-table-row\"\n                 style=\"height:70.66666666666667px;\"\n                 line-row-index=\"0\"\n                 line-column-length=\"3\"\n                 line-row-length=\"2\"\n                    >\n                \n                    \n    \n    <td title=\"列1行0\" control-abs-id=\"ctrl_103533208508500492\" class=\"control-table-column\"\n        \n        \n        line-column-index=\"0\"\n        line-column-length=\"3\"\n        line-row-length=\"2\"\n            >\n        \n        \n        \n        <div id=\"ctrl_446395325427698240\" class=\"control-abs control-abs-component control-abs-html-button control-abs-button control-abs-hideTitle \"\n             style=\"z-index:6;opacity:1;height:68.66666666666667px;border-radius:0px;border-left-width:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid\" >\n            <div class=\"control-inner-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle\">\n                \n        \n        <div class=\"control-title-abs\" style=\"left:px;top:px;z-index:;opacity:1;line-height:1.6;font-size:14px;background-color:#ffffff;vertical-align:middle;color:#333333;font-weight:normal;text-align:left;white-space:normal\" >自定义按钮事件--获取表单数据</div>\n        \n        <div class=\"control-container-abs\" style=\"left:px;top:px;z-index:;opacity:1;text-align:center;vertical-align:middle;text-align:center\">\n        <oui-include url=\"res_common/oui/ui/ui_pc/components/button.vue.html\"\n                     ref=\"ctrl_446395325427698240\"\n                     type=\"module\"\n                     data=\"pageData.getControlRenderDataById('ctrl_446395325427698240')\"></oui-include>\n        </div>\n        \n    \n    \n            </div>\n        </div>\n        \n    \n    \n        \n    </td>\n    \n\n                \n                    \n    \n    <td title=\"列2行0\" control-abs-id=\"ctrl_103533208508500492\" class=\"control-table-column\"\n        \n        \n        line-column-index=\"1\"\n        line-column-length=\"3\"\n        line-row-length=\"2\"\n            >\n        \n        \n        \n        <div id=\"ctrl_797543803148069441\" class=\"control-abs control-abs-component control-abs-html-button control-abs-button control-abs-hideTitle \"\n             style=\"z-index:7;opacity:1;height:68.66666666666667px;border-radius:0px;border-left-width:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid\" >\n            <div class=\"control-inner-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle\">\n                \n        \n        <div class=\"control-title-abs\" style=\"left:px;top:px;z-index:;opacity:1;line-height:1.6;font-size:14px;background-color:#ffffff;vertical-align:middle;color:#333333;font-weight:normal;text-align:left;white-space:normal\" >自定义按钮事件-- 填充控件值</div>\n        \n        <div class=\"control-container-abs\" style=\"left:px;top:px;z-index:;opacity:1;text-align:center;vertical-align:middle;text-align:center\">\n        <oui-include url=\"res_common/oui/ui/ui_pc/components/button.vue.html\"\n                     ref=\"ctrl_797543803148069441\"\n                     type=\"module\"\n                     data=\"pageData.getControlRenderDataById('ctrl_797543803148069441')\"></oui-include>\n        </div>\n        \n    \n    \n            </div>\n        </div>\n        \n    \n    \n        \n    </td>\n    \n\n                \n                    \n                \n            </tr>\n            \n\n            \n            \n\n            \n        </tbody>\n    </table>\n    \n            </div>\n        </div>    <div id=\"ctrl_617202128758789687\" class=\"control-abs control-abs-component control-abs-html-textInput control-abs-textfield control-abs-oneLine \"\n             style=\"left:0px;top:70.6563px;z-index:2;opacity:1;width:99.9113%;height:60px;border-radius:0px;border-left-width:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid\" >\n            <div class=\"control-inner-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle\">\n                \n        \n        <div class=\"control-title-abs\" style=\"left:px;top:px;z-index:;opacity:1;line-height:1.6;font-size:14px;background-color:#ffffff;vertical-align:middle;color:#333333;font-weight:normal;text-align:left;white-space:normal\" >单行输入框a</div>\n        \n        <div class=\"control-container-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle;text-align:\">\n        <oui-include url=\"res_common/oui/ui/ui_pc/components/textfield.vue.html\"\n                     ref=\"ctrl_617202128758789687\"\n                     type=\"module\"\n                     data=\"pageData.getControlRenderDataById('ctrl_617202128758789687')\"></oui-include>\n        </div>\n        \n    \n    \n            </div>\n        </div>        <div id=\"ctrl_546798960100516040\" class=\"control-abs control-abs-component control-abs-html-textInput control-abs-textfield control-abs-oneLine \"\n             style=\"left:0px;top:130.6563px;z-index:3;opacity:1;width:99.9133%;height:60px;border-radius:0px;border-left-width:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid\" >\n            <div class=\"control-inner-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle\">\n                \n        \n        <div class=\"control-title-abs\" style=\"left:px;top:px;z-index:;opacity:1;line-height:1.6;font-size:14px;background-color:#ffffff;vertical-align:middle;color:#333333;font-weight:normal;text-align:left;white-space:normal\" >单行输入框b</div>\n        \n        <div class=\"control-container-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle;text-align:\">\n        <oui-include url=\"res_common/oui/ui/ui_pc/components/textfield.vue.html\"\n                     ref=\"ctrl_546798960100516040\"\n                     type=\"module\"\n                     data=\"pageData.getControlRenderDataById('ctrl_546798960100516040')\"></oui-include>\n        </div>\n        \n    \n    \n            </div>\n        </div>    <div id=\"ctrl_037085037241934761\" class=\"control-abs control-abs-component control-abs-html-textInput control-abs-textfield control-abs-oneLine \"\n             style=\"left:0px;top:190.6563px;z-index:4;opacity:1;width:99.9133%;height:60px;border-radius:0px;border-left-width:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid\" >\n            <div class=\"control-inner-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle\">\n                \n        \n        <div class=\"control-title-abs\" style=\"left:px;top:px;z-index:;opacity:1;line-height:1.6;font-size:14px;background-color:#ffffff;vertical-align:middle;color:#333333;font-weight:normal;text-align:left;white-space:normal\" >单行输入框bc</div>\n        \n        <div class=\"control-container-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle;text-align:\">\n        <oui-include url=\"res_common/oui/ui/ui_pc/components/textfield.vue.html\"\n                     ref=\"ctrl_037085037241934761\"\n                     type=\"module\"\n                     data=\"pageData.getControlRenderDataById('ctrl_037085037241934761')\"></oui-include>\n        </div>\n        \n    \n    \n            </div>\n        </div>    <div id=\"ctrl_293927802970594511\" class=\"control-abs control-abs-component control-abs-html-textInput control-abs-textfield control-abs-oneLine \"\n             style=\"left:0px;top:250.6563px;z-index:5;opacity:1;width:99.9133%;height:60px;border-radius:0px;border-left-width:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid\" >\n            <div class=\"control-inner-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle\">\n                \n        \n        <div class=\"control-title-abs\" style=\"left:px;top:px;z-index:;opacity:1;line-height:1.6;font-size:14px;background-color:#ffffff;vertical-align:middle;color:#333333;font-weight:normal;text-align:left;white-space:normal\" >单行输入框bcd</div>\n        \n        <div class=\"control-container-abs\" style=\"left:px;top:px;z-index:;opacity:1;vertical-align:middle;text-align:\">\n        <oui-include url=\"res_common/oui/ui/ui_pc/components/textfield.vue.html\"\n                     ref=\"ctrl_293927802970594511\"\n                     type=\"module\"\n                     data=\"pageData.getControlRenderDataById('ctrl_293927802970594511')\"></oui-include>\n        </div>\n        \n    \n    \n            </div>\n        </div>  \n    </div>\n","selectContent":"","style":{"backgroundImageName":"","backgroundImage":"","backgroundImageFillType":"center","backgroundColor":"#ffffff","width":210,"height":297,"paperType":"A4","cellType":"mm","currControlZIndex":7,"width4px":793.688,"height4px":1122.52},"innerStyle":{"style":{"width":230,"height":42,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":0,"layoutType":"oneLine","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid"},"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"}},"controls":[{"style":{"width":353.6666666666667,"height":68.66666666666667,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":6,"layoutType":"hideTitle","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","left":1,"top":1,"rect":{"tableLineId":"ctrl_103533208508500492","columnIndex":0,"rowIndex":0,"left":1,"top":1,"right":354.6666666666667,"bottom":69.66666666666667,"controlId":"ctrl_446395325427698240"}},"innerStyle":{"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{"textAlign":"center"},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"},"styleFieldString":"left:px;top:px;z-index:;opacity:1;line-height:1.6;border-left-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;font-size:14px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid;color:#333333;font-weight:normal;text-align:left;white-space:normal"},"htmlType":"button","controlType":"button","showType":0,"isFormField":false,"name":"自定义按钮事件--获取表单数据","description":"","id":"ctrl_446395325427698240","parentId":"ctrl_103533208508500492","bizId":"ctrl_595153229526768431","detailId":"","configTemplate":"","icon":"","fieldType":"","canCloneControl":true,"otherAttrs":{"bizDes":""},"events":{"click":{"params":[],"startCode":"","bodyCode":"var pageData = this.getPageData();\nvar mainData = pageData.mainData;\nalert(oui.parseString(mainData));\n//提交数据 oui.postData(oui.getContextPath()+'res_engine/page_design/pc/page-design.html',mainData,function(res){},function(err){});//提交数据 例子\n","endCode":"","returnType":"string"}}},{"style":{"width":791.969,"height":70.6563,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":1,"layoutType":"oneLine","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","lineHeight":1,"columnSize":3,"rowSize":3,"columnLines":[{"fromPos":{"left":0,"top":0},"toPos":{"left":0,"top":209},"config":{"color":"#e6e6e6","lineHeight":1}},{"fromPos":{"left":354.6666666666667,"top":0},"toPos":{"left":199.66666666666666,"top":209},"config":{"color":"#e6e6e6","lineHeight":1}},{"fromPos":{"left":791.6883333333334,"top":0},"toPos":{"left":691.6883333333334,"top":209},"config":{"color":"#e6e6e6","lineHeight":1}}],"rowLines":[{"fromPos":{"left":0,"top":0},"toPos":{"left":599,"top":0},"config":{"color":"#e6e6e6","lineHeight":1}},{"fromPos":{"left":0,"top":69.66666666666667},"toPos":{"left":599,"top":69.66666666666667},"config":{"color":"#e6e6e6","lineHeight":1}}],"left":0,"top":0,"isDragging4SelectArea":false,"cellsMap":{"0_0":{"tableLineId":"ctrl_103533208508500492","columnIndex":0,"rowIndex":0,"left":1,"top":1,"right":354.6666666666667,"bottom":69.66666666666667,"controlId":"ctrl_446395325427698240"},"1_0":{"tableLineId":"ctrl_103533208508500492","columnIndex":1,"rowIndex":0,"left":355.6666666666667,"top":1,"right":791.6883333333334,"bottom":69.66666666666667,"controlId":"ctrl_797543803148069441"}}},"innerStyle":{"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"}},"htmlType":"tableLine","controlType":"tableLine","showType":0,"isFormField":false,"name":"插入格子","fieldType":"","id":"ctrl_103533208508500492","parentId":"","bizId":"ctrl_301835864322731910","detailId":"","description":"","configTemplate":"","icon":"","canCloneControl":true,"otherAttrs":{},"events":{}},{"style":{"width":792.984,"height":60,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":2,"layoutType":"oneLine","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","left":0,"top":70.6563},"innerStyle":{"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"},"styleFieldString":"left:px;top:px;z-index:;opacity:1;line-height:1.6;border-left-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;font-size:14px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid;color:#333333;font-weight:normal;text-align:left;white-space:normal"},"htmlType":"textInput","controlType":"textfield","showType":0,"isFormField":true,"name":"单行输入框a","fieldType":"string","id":"ctrl_617202128758789687","parentId":"","bizId":"ctrl_297975416695101920","detailId":"","description":"","configTemplate":"","icon":"","canCloneControl":true,"otherAttrs":{"bizDes":""},"events":{}},{"style":{"width":436.0216666666667,"height":68.66666666666667,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":7,"layoutType":"hideTitle","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","left":355.6666666666667,"top":1,"rect":{"tableLineId":"ctrl_103533208508500492","columnIndex":1,"rowIndex":0,"left":355.6666666666667,"top":1,"right":791.6883333333334,"bottom":69.66666666666667,"controlId":"ctrl_797543803148069441"}},"innerStyle":{"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{"textAlign":"center"},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"},"styleFieldString":"left:px;top:px;z-index:;opacity:1;line-height:1.6;border-left-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;font-size:14px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid;color:#333333;font-weight:normal;text-align:left;white-space:normal"},"htmlType":"button","controlType":"button","showType":0,"isFormField":false,"name":"自定义按钮事件-- 填充控件值","description":"","id":"ctrl_797543803148069441","parentId":"ctrl_103533208508500492","bizId":"ctrl_595153229526768431","detailId":"","configTemplate":"","icon":"","fieldType":"","canCloneControl":true,"otherAttrs":{"bizDes":""},"events":{"click":{"params":[],"startCode":"","bodyCode":"var pageData = this.getPageData();\nvar designer = pageData.getDesigner();\nvar controls = designer.controls||[];\nvar count =0;\n\nfor(var i=0,len=controls.length;i<len;i++){\n  if(controls[i].isFormField){\n    count++;\n    pageData.mainData[controls[i].id] = {\n      value:'测试-'+count, //组件实际值，用于数据库存储\n      display:'测试-'+count, //组件的显示值，用于后台数据存储使用\n      data4DB:{'test':'这里是对数据的扩展'+count} // data4DB是扩展表单提交数据的额外属性,根据特殊场景处理\n    }\n }\n}\npageData.refresh(); ","endCode":"","returnType":"string"}}},{"style":{"width":793,"height":60,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":3,"layoutType":"oneLine","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","left":0,"top":130.6563},"innerStyle":{"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"},"styleFieldString":"left:px;top:px;z-index:;opacity:1;line-height:1.6;border-left-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;font-size:14px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid;color:#333333;font-weight:normal;text-align:left;white-space:normal"},"htmlType":"textInput","controlType":"textfield","showType":0,"isFormField":true,"name":"单行输入框b","fieldType":"string","id":"ctrl_546798960100516040","parentId":"","bizId":"ctrl_827931781546190077","detailId":"","description":"","configTemplate":"","icon":"","canCloneControl":true,"otherAttrs":{"bizDes":""},"events":{}},{"style":{"width":793,"height":60,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":4,"layoutType":"oneLine","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","left":0,"top":190.6563},"innerStyle":{"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"},"styleFieldString":"left:px;top:px;z-index:;opacity:1;line-height:1.6;border-left-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;font-size:14px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid;color:#333333;font-weight:normal;text-align:left;white-space:normal"},"htmlType":"textInput","controlType":"textfield","showType":0,"isFormField":true,"name":"单行输入框bc","fieldType":"string","id":"ctrl_037085037241934761","parentId":"","bizId":"ctrl_827931781546190077","detailId":"","description":"","configTemplate":"","icon":"","canCloneControl":true,"otherAttrs":{"bizDes":""},"events":{}},{"style":{"width":793,"height":60,"backgroundColor":"#ffffff","borderRadius":0,"opacity":1,"zIndex":5,"layoutType":"oneLine","borderLeftWidth":0,"borderTopWidth":0,"borderBottomWidth":0,"borderRightWidth":0,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","left":0,"top":250.6563},"innerStyle":{"styleTitle":{"color":"#333333","lineHeight":1.6,"backgroundColor":"#ffffff","fontSize":14,"fontWeight":"normal","textAlign":"left","verticalAlign":"middle","whiteSpace":"normal"},"styleFieldOuter":{},"styleInnerOuter":{"verticalAlign":"middle"},"styleField":{"color":"#333333","backgroundColor":"#ffffff","lineHeight":1.6,"fontSize":14,"fontWeight":"normal","textAlign":"left","borderLeftWidth":1,"borderTopWidth":1,"borderBottomWidth":1,"borderRightWidth":1,"borderLeftColor":"#e6e6e6","borderTopColor":"#e6e6e6","borderBottomColor":"#e6e6e6","borderRightColor":"#e6e6e6","borderLeftStyle":"solid","borderTopStyle":"solid","borderBottomStyle":"solid","borderRightStyle":"solid","whiteSpace":"normal"},"styleFieldString":"left:px;top:px;z-index:;opacity:1;line-height:1.6;border-left-width:1px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;font-size:14px;background-color:#ffffff;border-left-color:#e6e6e6;border-top-color:#e6e6e6;border-bottom-color:#e6e6e6;border-right-color:#e6e6e6;border-left-style:solid;border-top-style:solid;border-bottom-style:solid;border-right-style:solid;color:#333333;font-weight:normal;text-align:left;white-space:normal"},"htmlType":"textInput","controlType":"textfield","showType":0,"isFormField":true,"name":"单行输入框bcd","fieldType":"string","id":"ctrl_293927802970594511","parentId":"","bizId":"ctrl_827931781546190077","detailId":"","description":"","configTemplate":"","icon":"","canCloneControl":true,"otherAttrs":{"bizDes":""},"events":{}}],"otherAttrs":{"bizDes":""},"events":{"beforeInit":{"params":[],"startCode":"","bodyCode":"var pageData = this.getPageData();\nvar designer = pageData.getDesigner();\nvar controls = designer.controls||[];\nvar count =0;\n\nfor(var i=0,len=controls.length;i<len;i++){\n  if(controls[i].isFormField){\n    count++;\n    pageData.mainData[controls[i].id] = {\n      value:'测试-'+count, //组件实际值，用于数据库存储\n      display:'测试-'+count, //组件的显示值，用于后台数据存储使用\n      data4DB:{'test':'这里是对数据的扩展'+count} // data4DB是扩展表单提交数据的额外属性,根据特殊场景处理\n    }\n }\n}\npageData.refresh(); \n","endCode":"","returnType":"string"}}};

            }
            var me = this;
            var pageData = oui.util.createPageData({
                refresh:function(){
                    me.refresh&&me.refresh();
                },
                designer:designData,
                mainData:{},//主表数据
                detailData:{}//子表数据
            });
            pageData.beforeInit(); //初始化前
            this.content = pageData.render(); //渲染
            this.pageData = pageData;
            pageData.afterInit();//渲染完成

            console.log("顶层控制器");
            console.log(com.oui.AppController.designData);
            console.log(this.$router);
            this.refresh();
        },
        methods:{
            getPageData:function getPageData(){
                return this.pageData;
            }
        }

    }
</script>

<!--本页自定义样式处理-->
<style>
</style>